<!DOCTYPE html>
<html>
	<head>
		<title> sagapo project </title>
		<link type="text/css" rel="stylesheet" href="/css/default.css" />
		<meta charset="utf-8" />
		<script src="/js/jquery.min.js"></script>
		<script src="/js/jquery.stickyfloat.js"></script>
		<script>
			$(function() {
				$("aside").stickyfloat({ duration: 400 });
			});
		</script>
	</head>

	<body>
		<div class="wrap">
			<div class="container">
				<header>
					<div class="content">
						<hgroup>
							<h3 class="c1">
								CHO
							</h3>
							<h3 class="c1">
								SUNG HOON
							</h3>
							
							<h3 class="c2">
								CHOI
							</h3>
							<h3 class="c2">
								GYEOL
							</h3>
						</hgroup>
						<nav>
							<h2>NAVIGATION</h2>
							<ul>
								<li><a href="#" class="selected">가나다</a></li>
								<li><a href="#">가나다</a></li>
								<li><a href="#">가나다</a></li>
								<li><a href="#">가나다</a></li>
								<li><a href="#">가나다</a></li>
								<li><a href="#">가나다</a></li>
								<li><a href="#">가나다</a></li>
								<li><a href="#">가나다</a></li>
							</ul>
						</nav>
					</div>
				</header>
				
				<section class="main">
					<div class="content">
						<article>
							<h2><a href="#">가나다라마바사아 </a></h2>
						</article>
						<article>
							<h2><a href="#">가나다라마바사아 </a></h2>
						</article>
					</div>
				</section>
				<footer class="main">
					<div class="content">
						<article>
							<h2><a href="#">가나다라마바사아 </a></h2>
						</article>
						<article>
							<h2><a href="#">가나다라마바사아 </a></h2>
						</article>
					</div>
				</footer>	
			</div>
			<aside>
				<div class="box selectbox">
					<a href="#">hoon</a>
				</div>
				<div class="box unselectbox">
					<a href="#">gyeol</a>
				</div>
			</aside>
		</div>
	</body>
</html>
